<!DOCTYPE html>
<html lang="en">
<head>
    <!-- META SECTION -->
    <title>个人中心--互联网金融司法诉讼平台</title>
    <link rel="shortcut icon" href="../assets/images/gt_header.png">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
    <meta name="viewport" content="width=device-width, initial-scale=1"/>

    <link rel="icon" href="favicon.ico" type="image/x-icon"/>
    <!-- END META SECTION -->

    <!-- CSS INCLUDE -->
    <link rel="stylesheet" type="text/css" id="theme" href="css/theme-default.css"/>
    <!-- EOF CSS INCLUDE -->

    <script type="text/javascript">
        window.onload = function () {
            $.post('/baseInfo',
                    function (result_str) {
                        var strArr = result_str.split("|");
                        document.getElementById("leftUserName").innerHTML = strArr[0];
                        document.getElementById("topUserName").innerHTML = strArr[0];
                        document.getElementById("userName").innerHTML = strArr[0];
                        document.getElementById("companyName").innerHTML = strArr[1];
                        document.getElementById("totalCaseCount").innerHTML = strArr[2];
                        document.getElementById("successCaseCount").innerHTML = strArr[3];
                    }
            );
            $.post('/suitProgress',
                    function (resultArr) {
                        if(resultArr=="无效的用户名"){
                            alert(resultArr);
                        }else {
                            var caseArr = eval("(" + resultArr + ")");
                            //alert(resultArr);
                            //alert(caseArr);
                            var tableData1 = "";
                            var tableData2 = "";
                            var len = caseArr.length > 3 ? 3 : caseArr.length;
                            for (var i = 0; i < len; i++) {
                                if (caseArr[i][0].service_type == "诉讼") {
                                    tableData1 += "<tr><td><strong>" + caseArr[i][0].case_name + "</strong></td>"
                                            + "<td><strong>" + caseArr[i][0].depute_time + "</strong></td >"
                                            + "<td><strong>" + caseArr[i][0].lawyer_name + "</strong></td>"
                                            + "<td><strong>" + caseArr[i][0].service_type + "</strong></td>"
                                            + "<td>";
                                    tableData1 += "<div class='progress progress-small progress-striped active'>";
                                    for (var j = 1; j < caseArr[i].length - 1; j++) {
                                        tableData1 += "<div class='progress-bar' title='" + caseArr[i][j].status_type + " " + caseArr[i][j].status_time + "' style='width: 10.6%;margin-right: 2px;border-radius: 10px;background-color: #E04B4A'></div>"
                                    }
                                    tableData1 += "<div class='progress-bar' title='" + caseArr[i][caseArr[i].length - 1].status_type + " " + caseArr[i][caseArr[i].length - 1].status_time + "' style='width: 10.6%;margin-right: 2px;border-radius: 10px;background-color: yellowgreen;'></div>"
                                    for (var k = 0; k <= 9 - caseArr[i].length; k++) {
                                        tableData1 += "<div class='progress-bar' title='未完成' style='width: 10.6%;margin-right: 2px;border-radius: 10px;background-color: gainsboro;'></div>"
                                    }
                                } else {
                                    tableData1 += "<tr><td><strong>" + caseArr[i][0].case_name + "</strong></td>"
                                            + "<td><strong>" + caseArr[i][0].depute_time + "</strong></td >"
                                            + "<td><strong>" + caseArr[i][0].lawyer_name + "</strong></td>"
                                            + "<td><strong>" + caseArr[i][0].service_type + "</strong></td>"
                                            + "<td>";
                                    tableData1 += "<div class='progress progress-small progress-striped active'>";
                                    for (var j = 1; j < caseArr[i].length - 1; j++) {
                                        tableData1 += "<div class='progress-bar' title='" + caseArr[i][j].status_type + " " + caseArr[i][j].status_time + "' style='width: 13.76%;margin-right: 2px;border-radius: 10px;background-color: #E04B4A'></div>"
                                    }
                                    tableData1 += "<div class='progress-bar' title='" + caseArr[i][caseArr[i].length - 1].status_type + " " + caseArr[i][caseArr[i].length - 1].status_time + "' style='width: 13.76%;margin-right: 2px;border-radius: 10px;background-color: yellowgreen;'></div>"
                                    for (var k = 0; k <= 7 - caseArr[i].length; k++) {
                                        tableData1 += "<div class='progress-bar' title='未完成' style='width: 13.76%;margin-right: 2px;border-radius: 10px;background-color: gainsboro;'></div>"
                                    }
                                }
                                tableData1 += "</div></td></tr>";
                            }
                            $("#suitProgress").html(tableData1);
                            for (var i = 0; i < caseArr.length; i++) {
                                if (caseArr[i][caseArr[i].length - 1].status_type == "诉讼结束") {
                                    tableData2 += "<tr><td><strong>" + caseArr[i][0].case_name + "</strong></td>"
                                            + "<td><strong>" + caseArr[i][0].depute_time + "</strong></td >"
                                            + "<td><strong>" + caseArr[i][0].lawyer_name + "</strong></td>"
                                            + "<td><strong>" + caseArr[i][0].service_type + "</strong></td><td></td>";
                                    tableData2 += "<td style='vertical-align: middle;'><button type='button' class='btn btn-info' style='border-radius: 5px;'data-toggle='modal'data-target=#evaluate'>评价</button></td></tr>"
                                }
                            }
                            $("#suitEvaluation").html(tableData2);
                        }
                    }
            )
        }
    </script>
</head>
<body>
<!-- START PAGE CONTAINER -->
<div class="page-container">

    <!-- START PAGE SIDEBAR -->
    <div class="page-sidebar">
        <!-- START X-NAVIGATION -->
        <ul class="x-navigation">
            <li class="xn-logo">
                <a href="personalCenter.html" style="background-color: #1d2127;">
                    <img src="../assets/images/logo.png"
                         style="width: 220px;margin-top: -10px;margin-left: -16px;"></a>
                <a href="#" class="x-navigation-control"></a>
            </li>
            <li class="xn-profile">
                <a href="#" class="profile-mini">
                    <img src="assets/images/users/avatar.jpg" alt="John Doe"/>
                </a>
                <div class="profile">
                    <div class="profile-image">
                        <a href="../index1.html" target="_blank"> <img src="assets/images/users/avatar.jpg"
                                                                       alt="John Doe" alt="图片说明" title="点击修改头像"
                                                                       style="margin-top: 10px;"/></a>
                    </div>
                    <div class="profile-data">
                        <div class="profile-data-name" id="leftUserName" style="margin-top: 5px;"></div>
                    </div>
                </div>
            </li>
            <li class="xn-title" style="padding-top: 15px;padding-bottom: 15px;">欢迎来到互联网金融司法诉讼平台</li>
            <li class="active">
                <a href="personalCenter.html" style="font-size: 15px;"><span class="fa fa-user"></span> <span
                        class="xn-text">个人中心</span></a>
            </li>
            <li>
                <a href="basicInfo.html" style="font-size: 15px;"><span class="fa fa-file-text-o"></span> <span
                        class="xn-text">基本信息</span></a>

            </li>
            <li>
                <a href="securityCenter.html"><span class="fa fa-cogs"></span> <span class="xn-text" style="font-size: 15px;">安全中心</span></a>
            </li>
            <li>
                <a href="submitSuit.html"><span class="fa fa-suitcase"></span> <span class="xn-text"
                                                                                     style="font-size: 15px;">发布诉讼</span></a>
            </li>
            <li>
                <a href="myCases.html"><span class="fa fa-archive"></span> <span class="xn-text"
                                                                      style="font-size: 15px;">我的案件</span></a>
            </li>
        </ul>
        <!-- END X-NAVIGATION -->
    </div>
    <!-- END PAGE SIDEBAR -->

    <!-- PAGE CONTENT -->
    <div class="page-content">

        <!-- START X-NAVIGATION VERTICAL -->
        <ul class="x-navigation x-navigation-horizontal x-navigation-panel">
            <!-- TOGGLE NAVIGATION -->
            <li class="xn-icon-button">
                <a href="#" class="x-navigation-minimize"><span class="fa fa-dedent"></span></a>
            </li>
            <!-- END TOGGLE NAVIGATION -->
            <!-- SIGN OUT -->
            <li class="xn-icon-button pull-right">
                <a href="#" class="mb-control" data-box="#mb-signout"><span class="fa fa-sign-out"></span></a>
            </li>
            <!-- END SIGN OUT -->
            <!-- MESSAGES -->
            <li class="xn-icon-button pull-right">
                <a href="personalCenter.html" style="padding-left: 0px;width: 150px;padding-right: 0px;"
                   id="topUserName"></a>
            </li>
            <!-- END MESSAGES -->
            <!-- Hello -->
            <li class="xn-icon-button pull-right">
                <a style="width: 60px;">您好，</a>
            </li>
            <!-- END Hello -->
        </ul>

        <!-- END X-NAVIGATION VERTICAL -->


        <!-- START BREADCRUMB -->
        <ul class="breadcrumb">
            <li><a href="#">个人中心</a></li>
            <li class="active"></li>
        </ul>
        <!-- END BREADCRUMB -->

        <!-- PAGE CONTENT WRAPPER -->
        <div class="page-content-wrap">

            <!-- START WIDGETS -->
            <div class="row">

                <div class="col-md-12" style=" height: 710px;">

                    <!-- START VISITORS BLOCK -->
                    <div class="panel panel-default">
                        <div class="panel-heading">
                            <div class="panel-title-box">
                                <h3 style="font-size: 15px; font-family: 微软雅黑;">用户信息</h3>

                            </div>

                            <ul class="panel-controls" style="margin-top: 2px;">
                                <li><a href="basicInfo.html"  alt="图片说明" title="完善基本信息"
                                      ><span class="fa fa-pencil"></span></a></li>
                                <li><a href="#" class="panel-refresh" alt="图片说明" title="刷新"><span class="fa fa-refresh"
                                                                                                  ></span></a>
                                </li>
                                <li class="dropdown" alt="图片说明" title="设置">
                                    <a href="#" class="dropdown-toggle" data-toggle="dropdown"
                                       ><span class="fa fa-cog"></span></a>
                                    <ul class="dropdown-menu">
                                        <li><a href="#" class="panel-collapse"><span class="fa fa-angle-down"></span> 折叠</a>
                                        </li>
                                        <li><a href="#" class="panel-remove"><span class="fa fa-times"></span> 关闭</a>
                                        </li>
                                    </ul>
                                </li>
                            </ul>
                        </div>
                        <div class="panel-body widget widget-default widget-item-icon" style="margin-bottom: 0px;">
                            <div class="widget-item-left">
                                <span class="fa fa-user"></span>
                            </div>
                            <div class="row" style="height: 40px; margin-top: 20px;">
                                <div class="col-md-1"></div>
                                <div class="col-md-2">
                                    <div class="widget-title">用户名</div>
                                </div>
                                <div class="col-md-2">
                                    <div class="title" style="font-size: 16px;/*color: #3b8cff;*/font-weight: bold;"
                                         id="userName"></div>
                                </div>
                                <div class="col-md-3">
                                    <div class="widget-title">累计发布诉讼件数</div>
                                </div>
                                <div class="col-md-2">
                                    <div class="title" style="font-size: 16px;/*color: #3b8cff;*/font-weight: bold;"
                                         id="totalCaseCount"></div>
                                </div>
                                <div class="col-md-1"></div>
                            </div>

                            <div class="row">
                                <div class="col-md-1"></div>
                                <div class="col-md-2">
                                    <div class="widget-title">企业名称</div>
                                </div>
                                <div class="col-md-2">
                                    <div class="title" style="font-size: 16px;/*color: #3b8cff;*/font-weight: bold;"
                                         id="companyName"></div>
                                </div>
                                <div class="col-md-3">
                                    <div class="widget-title">诉讼成功件数</div>
                                </div>
                                <div class="col-md-2">
                                    <div class="title" style="font-size: 16px;/*color: #3b8cff;*/font-weight: bold;"
                                         id="successCaseCount"></div>
                                </div>
                                <div class="col-md-1"></div>
                            </div>
                        </div>
                        <!-- END VISITORS BLOCK -->
                    </div>
                    <!-- END WIDGETS -->

                    <div class="col-md-12">

                        <!-- START PROJECTS BLOCK -->
                        <div class="panel panel-default">
                            <div class="panel-heading">
                                <div class="panel-title-box">
                                    <h3 style="font-size: 15px; font-family: 微软雅黑;">案件进度查看</h3>

                                </div>
                                <ul class="panel-controls" style="margin-top: 2px;">
                                    <li><a href="myCases.html" class="panel-fullscreen" alt="图片说明" title="查看更多案件进度"
                                          ><span class="fa fa-expand"></span></a></li>
                                    <li><a href="#" class="panel-refresh" alt="图片说明" title="刷新"><span
                                            class="fa fa-refresh" ></span></a></li>
                                    <li class="dropdown" alt="图片说明" title="设置">
                                        <a href="#" class="dropdown-toggle" data-toggle="dropdown"
                                          ><span class="fa fa-cog"></span></a>
                                        <ul class="dropdown-menu">
                                            <li><a href="#" class="panel-collapse"><span
                                                    class="fa fa-angle-down"></span> 折叠</a></li>
                                            <li><a href="#" class="panel-remove"><span class="fa fa-times"></span>
                                                关闭</a></li>
                                        </ul>
                                    </li>
                                </ul>
                            </div>
                            <div class="panel-body panel-body-table">

                                <div class="table-responsive">
                                    <table class="table table-bordered table-striped" style="text-align: center;">
                                        <thead>
                                        <tr>
                                            <th width="30%" style="text-align: center;">案件名称</th>
                                            <th width="10%" style="text-align: center;">委托日期</th>
                                            <th width="10%" style="text-align: center;">律师姓名</th>
                                            <th width="10%" style="text-align: center;">服务类型</th>
                                            <th width="40%" style="text-align: center;">案件进度</th>
                                        </tr>
                                        </thead>
                                        <tbody id="suitProgress">

                                        </tbody>
                                    </table>
                                </div>

                            </div>
                        </div>
                        <!-- END PROJECTS BLOCK -->

                    </div>

                    <div class="col-md-12">

                        <!-- START PROJECTS BLOCK -->
                        <div class="panel panel-default">
                            <div class="panel-heading">
                                <div class="panel-title-box">
                                    <h3 style="font-size: 15px; font-family: 微软雅黑;">案件评价</h3>
                                </div>
                                <ul class="panel-controls" style="margin-top: 2px;">
                                    <li><a href="#" class="panel-refresh" alt="图片说明" title="刷新"
                                          ><span class="fa fa-refresh"></span></a></li>
                                    <li class="dropdown" alt="图片说明" title="设置">
                                        <a href="#" class="dropdown-toggle" data-toggle="dropdown"><span
                                                class="fa fa-cog" ></span></a>
                                        <ul class="dropdown-menu">
                                            <li><a href="#" class="panel-collapse"><span
                                                    class="fa fa-angle-down"></span> 折叠</a></li>
                                            <li><a href="#" class="panel-remove"><span class="fa fa-times"></span>
                                                关闭</a></li>
                                        </ul>
                                    </li>
                                </ul>
                            </div>
                            <div class="panel-body panel-body-table">
                                <div class="table-responsive ">
                                    <table class="table table-bordered table-striped " style="text-align: center;">
                                        <thead>
                                        <tr>
                                            <th width="30%" style="text-align: center;">案件名称</th>
                                            <th width="10%" style="text-align: center;">委托日期</th>
                                            <th width="10%" style="text-align: center;">律师姓名</th>
                                            <th width="10%" style="text-align: center;">服务类型</th>
                                            <th width="30%" style="text-align: center;">案件进度</th>
                                            <th width="10%" style="text-align: center;">操作</th>
                                        </tr>
                                        </thead>
                                        <tbody id="suitEvaluation">
                                        <tr>
                                            <td style=" vertical-align: middle;">
                                                <button type="button" class="btn btn-info" style="border-radius: 5px;"
                                                        data-toggle="modal"
                                                        data-target="#evaluate"> 评价
                                                </button>
                                            </td>
                                        </tr>
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <!-- END PROJECTS BLOCK -->
        </div>
    </div>
    <!-- END PAGE CONTENT WRAPPER -->
</div>
<!-- END PAGE CONTENT -->
</div>
<!-- END PAGE CONTAINER -->

        <!-- 模态框（evaluate） -->
        <div class="modal fade" id="evaluate" tabindex="-1" role="dialog"
             aria-labelledby="uploadLabel2" aria-hidden="true"
        >
            <div class="modal-dialog">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal"
                                aria-hidden="true">×
                        </button>
                        <h4 class="modal-title" id="uploadLabel2">
                            发表评价
                        </h4>
                    </div>
                    <div class="modal-body">
                        <div class="row">
                            请您对该律师的服务进行评价
                        </div>
                        <div class="row" style=" margin-top: 20px;  margin-bottom: 20px;">

                            <div class="col-md-3">
                                <div style="position: relative;left: 15px;"><input type="checkbox"
                                                                                   class="icheckbox "
                                                                                   style="position: absolute; opacity: 0;">
                                    非常满意
                                </div>
                            </div>
                            <div class="col-md-3">
                                <div style="position: relative;left: 10px;"><input type="checkbox"
                                                                                   class="icheckbox "
                                                                                   style="position: absolute; opacity: 0;">
                                    比较满意
                                </div>
                            </div>
                            <div class="col-md-2">
                                <div style="position: relative;"><input type="checkbox"
                                                                        class="icheckbox"
                                                                        style="position: absolute; opacity: 0;"> 一般
                                </div>
                            </div>
                            <div class="col-md-2">
                                <div style="position: relative;"><input type="checkbox"
                                                                        class="icheckbox"
                                                                        style="position: absolute; opacity: 0;"> 比较差
                                </div>
                            </div>
                            <div class="col-md-2">
                                <div style="position: relative;"><input type="checkbox"
                                                                        class="icheckbox"
                                                                        style="position: absolute; opacity: 0;"> 恶劣
                                </div>
                            </div>

                        </div>
                    </div>


                    <div class="modal-footer">
                        <button type="button" class="btn btn-default"
                                data-dismiss="modal">关闭
                        </button>
                        <button type="button" class="btn btn-primary">
                            确定
                        </button>
                    </div>
                </div><!-- /.modal-content -->
            </div><!-- /.modal-dialog -->
        </div><!-- /.modal -->
        <script>
            $(function () {
                $('#publishEvi').modal({
                    keyboard: true
                })
            });
        </script>


        <!-- MESSAGE BOX-->
        <div class="message-box animated fadeIn" data-sound="alert" id="mb-signout">
            <div class="mb-container">
                <div class="mb-middle">
                    <div class="mb-title"><span class="fa fa-sign-out"></span> 注 <strong>销</strong> ?</div>
                    <div class="mb-content">
                        <p>选择是注销当前用户，选择否将继续停留在该页面。</p>

                    </div>
                    <div class="mb-footer">
                        <div class="pull-right">
                            <a href="../signin.html" class="btn btn-success btn-lg">是</a>
                            <button class="btn btn-default btn-lg mb-control-close">否</button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- END MESSAGE BOX-->

        <!-- START PRELOADS -->
        <audio id="audio-alert" src="audio/alert.mp3" preload="auto"></audio>
        <audio id="audio-fail" src="audio/fail.mp3" preload="auto"></audio>
        <!-- END PRELOADS -->

        <!-- START SCRIPTS -->
        <!-- START PLUGINS -->
        <script type="text/javascript" src="js/plugins/jquery/jquery.min.js"></script>
        <script type="text/javascript" src="js/plugins/jquery/jquery-ui.min.js"></script>
        <script type="text/javascript" src="js/plugins/bootstrap/bootstrap.min.js"></script>
        <!-- END PLUGINS -->

        <!-- START THIS PAGE PLUGINS-->
        <script type='text/javascript' src='js/plugins/icheck/icheck.min.js'></script>
        <script type="text/javascript" src="js/plugins/mcustomscrollbar/jquery.mCustomScrollbar.min.js"></script>
        <script type="text/javascript" src="js/plugins/scrolltotop/scrolltopcontrol.js"></script>

        <script type="text/javascript" src="js/plugins/morris/raphael-min.js"></script>
        <script type="text/javascript" src="js/plugins/morris/morris.min.js"></script>
        <script type="text/javascript" src="js/plugins/rickshaw/d3.v3.js"></script>
        <script type="text/javascript" src="js/plugins/rickshaw/rickshaw.min.js"></script>
        <script type='text/javascript' src='js/plugins/jvectormap/jquery-jvectormap-1.2.2.min.js'></script>
        <script type='text/javascript' src='js/plugins/jvectormap/jquery-jvectormap-world-mill-en.js'></script>
        <script type='text/javascript' src='js/plugins/bootstrap/bootstrap-datepicker.js'></script>
        <script type="text/javascript" src="js/plugins/owl/owl.carousel.min.js"></script>

        <script type="text/javascript" src="js/plugins/moment.min.js"></script>
        <script type="text/javascript" src="js/plugins/daterangepicker/daterangepicker.js"></script>
        <!-- END THIS PAGE PLUGINS-->

        <!-- START TEMPLATE -->
        <script type="text/javascript" src="js/settings.js"></script>

        <script type="text/javascript" src="js/plugins.js"></script>
        <script type="text/javascript" src="js/actions.js"></script>

        <script type="text/javascript" src="js/demo_dashboard.js"></script>
        <!-- END TEMPLATE -->
        <!-- END SCRIPTS -->
</body>
</html>






